<template>
	<view class="addressslist">
		<view class="addressbox">
			<view v-if="addressList.length>0" class="addresssBox">
				<view class="addresssli" v-for="(item,index) in addressList" :key="index" @tap="selectAddress(item)">
					<view class="addressslicon">
						<view class="addresssliname">
							<view>姓名：&nbsp;{{item.realname}}&nbsp;
								<text class="addressslinameDefault" v-if="item.isDefault==1">默认</text>
							</view>
							<span>{{item.telephone}}</span>
						</view>
						<view class="addresssliinfo">
							<view class="addresssliinfotext">
								<view class="addresssliinfotextl">
									证件ID：
								</view>
								<view class="">
									{{item.IDNumber}}
								</view>
							</view>
						</view>
					</view>
					<view class="receipt">
						<!-- <view class="receiptl" @click.stop="item.isDefault!=1?receiptlFun(item.id,index):''">
							<image class="receiptlImg" v-if="item.isDefault==1" :src="imgUrl+'icon2.png'" mode="widthFix"></image>
							<image class="receiptlImg" v-else :src="imgUrl+'icon1.png'" mode="widthFix"></image>
							设置默认
						</view> -->
						<view class="receiptlist">
							<view class="addresssliedit" @tap.stop="editFun(item)">编辑</view>
							<view class="addresssliedit receiptliedit" v-if="item.isDefault!=1"
								@tap.stop="deleteFun(item)">删除</view>
						</view>
					</view>
				</view>
			</view>
			<sunui-template v-else title="快去添加联系人吧" />
		</view>
		<view class="delgoods" v-if="delgoodsshow">
			<view class="delgoodsctn">
				<view class="delgoodstit">确认删除该联系人吗?</view>
				<view class="delgoodsbtn">
					<view @click="closeshow">取消</view>
					<view @click="DelGoodsFun">确定</view>
				</view>
			</view>
		</view>
		<view class="addaddressbtn">
			<view @tap="editFun()" class="btn-class-w-h">
				+新增联系人
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgUrl: this.$apiFun.imgUrl,
				addressList: [],
				delgoodsshow: false,
			}
		},
		onShow() {
			this.init()
		},
		onLoad(option) {},
		methods: {
			//初始化方法
			async init() {
				var that = this
				var data = {}
				const {
					contactsList
				} = await this.$apiFun.getApi(
					this.$api.userDetailApi,
					data
				)
				console.log('res-----------', contactsList)
				that.addressList = contactsList
			},
			// 返回订单页
			selectAddress(item) {
				// if(this.shopId){
				// 	this.apply_alter_addressApi(item.id)
				// 	uni.navigateTo({
				// 		url:'/pages_goodsClass/Shopcart/uni_Orderconfirm?obj='+encodeURIComponent(JSON.stringify(item))
				// 	})
				// }
			},
			// 新增修改接口
			editFun(item) {
				let url = item ?
					'people?obj=' + encodeURIComponent(JSON.stringify(item)) :
					'people'
				uni.navigateTo({
					url: url,
				})
			},
			DelGoodsFun() {
				const that = this
				const data = [this.deleteFunid]
				this.$apiFun.delApi(this.$api.deleteContactsApi, data)
				that.init()
				uni.showToast({
					icon: 'none',
					title: '删除成功',
				})
				that.delgoodsshow = false
				this.init()
			},
			closeshow() {
				this.delgoodsshow = false
			},
			deleteFun(item) {
				this.deleteFunid = item.realname
				this.delgoodsshow = true
			},
			receiptlFun(id, index) {
				this.address_defaultApi(id)
			},
			address_defaultApi(id) {
				var that = this
				var data = {
					id: id
				}
				this.$apiFun.postApi(
					this.$api.setDefaultApi,
					data,
					function(res) {
						if (res.code == 200) {
							uni.showToast({
								icon: 'none',
								title: res.msg,
							})
							setTimeout(() => {
								that.init()
							}, 1000)
						}
					},
					function(err) {
						uni.showToast({
							icon: 'none',
							title: err.msg,
						})
					}
				)
			},
		},
	}
</script>
<style>
	page {
		height: 100%;
		background: #000000;
		color: white;
	}
</style>
<style scoped lang="less">
	page {
		height: 100%;
		width: 100%;
	}

	.addressslist {
		height: 100%;
		box-sizing: border-box;
		// background-color: rgba(255, 255, 255, .1);

		.addressbox {
			height: 100%;
		}
	}

	.addresssBox {
		padding: 5rpx 15rpx 150rpx;
	}

	.addresssli {
		width: 100%;
		overflow: hidden;
		// background-color: rgba(255, 255, 255, .1);
		padding: 38rpx 0 30rpx;
		margin: 20rpx 0;
		border-radius: 6rpx;

		.addressslicon {
			padding: 0 30rpx 30rpx;
			box-sizing: border-box;
			border-bottom: 1px solid #cccccc;
		}

		.receipt {
			padding: 30rpx 30rpx 0;
			overflow: hidden;
			height: auto;
		}

		.receiptl {
			float: left;
			box-sizing: border-box;
			background-position: left center;
			background-repeat: no-repeat;
			background-size: 25rpx;
			font-size: 24rpx;
			color: rgba(255, 255, 255, 1);
			display: flex;

			.receiptlImg {
				width: 35rpx;
				height: 35rpx;
			}
		}

		.receiptlist {
			float: right;
			display: flex;
		}

		.addresssliedit {
			width: 80rpx;
			box-sizing: border-box;
			background-position: left center;
			background-repeat: no-repeat;
			background-size: 25rpx;
			text-align: right;
			font-size: 24rpx;
			color: rgba(255, 255, 255, 1);
		}

		.receiptliedit {
			margin-left: 20rpx;
		}

		.addresssliname {
			height: 28rpx;
			line-height: 28rpx;
			font-size: 26rpx;
			color: rgba(255, 255, 255, 1);
			margin-bottom: 30rpx;
			display: flex;
			justify-content: space-between;

			.addressslinameDefault {
				font-size: 22rpx;
				color: #e42e3c;
				padding: 2rpx 5rpx;
				border-radius: 6rpx;
				border: 1rpx solid #e42e3c;
				margin-left: 5rpx;
			}
		}

		.addresssliinfo {
			display: flex;
			font-size: 26rpx;
			line-height: 30rpx;

			.addresssliinfotext {
				display: flex;

				.addresssliinfotextl {
					white-space: nowrap;
				}

				.addresssliinfotextr {
					flex: 1;
				}
			}
		}
	}

	.addaddressbtn {
		box-sizing: border-box;
		overflow: hidden;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 30rpx;
		display: flex;
	}

	.addaddressbtn view {
		margin: auto;
		width: 90%;
		height: 80rpx;
		color: #ffffff;
		font-size: 24rpx;
		float: left;
		border-radius: 0;
		text-align: center;
		line-height: 80rpx;
		background: linear-gradient(to right, #ff7a81, #fd2f79);
	}

	.delgoods {
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		overflow: hidden;
		position: fixed;
		top: 0;
		left: 0;
		margin: auto;
		z-index: 1000;
	}

	.delgoodsctn {
		width: 80%;
		height: 300rpx;
		background-color: rgba(0, 0, 0, .9);
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		padding: 5%;
	}

	.delgoodstit {
		width: 100%;
		height: 200rpx;
		line-height: 200rpx;
		overflow: hidden;
		text-align: center;
		color: rgba(255, 255, 255, 1);
		font-size: 34rpx;
	}

	.delgoodsbtn {
		height: 100rpx;
		overflow: hidden;
		text-align: center;
	}

	.delgoodsbtn view {
		width: 150rpx;
		height: 70rpx;
		display: inline-block;
		line-height: 70rpx;
		background-color: #f6f6f6;
		margin-right: 50rpx;
		color: rgba(0, 0, 0, 1);
		font-size: 30rpx;
	}

	.delgoodsbtn view:nth-child(2) {
		background-color: #eb453c;
		color: #ffffff;
		margin-right: 0;
	}
</style>